<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<title>登录</title>
<link href="/myhouse/static/web/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="/myhouse/static/web/js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--menu-->
<script src="/myhouse/static/web/js/scripts.js"></script>
<link href="/myhouse/static/web/css/styles.css" rel="stylesheet">
<!--//menu-->
<!--theme-style-->
<link href="/myhouse/static/web/css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Real Home Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
</head>
<body>
<script src="/myhouse/static/web/js/easyResponsiveTabs.js" type="text/javascript"></script>
<script type="text/javascript">
	$(document).ready(function () {
		$('#horizontalTab').easyResponsiveTabs({
			type: 'default', //Types: default, vertical, accordion
			width: 'auto', //auto or any width like 600px
			fit: true   // 100% fit in a container
		});
	});
</script>
<!--header-->
<jsp:include page="/inc/head.jsp"></jsp:include>
<!--//-->	
<div class=" banner-buying">
	<div class=" container">
		<h3><span>MY</span>house</h3>
	<!---->
<jsp:include page="/inc/menu.jsp"></jsp:include>
	<div class="clearfix"> </div>
		<script type="text/javascript">
			$(function() {
			    var menu_ul = $('.menu > li > ul'),
			           menu_a  = $('.menu > li > a');
			    menu_ul.hide();
			    menu_a.click(function(e) {
			        e.preventDefault();
			        if(!$(this).hasClass('active')) {
			            menu_a.removeClass('active');
			            menu_ul.filter(':visible').slideUp('normal');
			            $(this).addClass('active').next().stop(true,true).slideDown('normal');
			        } else {
			            $(this).removeClass('active');
			            $(this).next().stop(true,true).slideUp('normal');
			        }
			    });
			
			});
		</script>
		<script src="myhouse/webapp/static/js/jquery.min.js"></script>

      		
	</div>
</div>
<script type="text/javascript">
	$(function (){
		$("#username").blur(usernamev);
		$("#userpass").blur(userpassv);
	});
	function usernamev(){
		var reg = /^[\u4e00-\u999ffffA-Za-z0-9_]{2,10}$/;
		var name = $("#username").val();
		if (reg.test(name) && name != ""){
			$("#name").text("√");
			$("#name").css("color","green");
		}else {
			$("#name").text("×");
			$("#name").css("color","red");
		}
	}
	function userpassv(){
		var reg = /^\w{6,8}$/;
		var pass = $("#userpass").val()
		if (reg.test(pass) && pass != ""){
			$("#pass").text("√");
			$("#pass").css("color","green");
		}else {
			$("#pass").text("×");
			$("#pass").css("color","red");
		}
	}
</script>

<div class="login-right">
	<div class="container">
		<h3>登录</h3>
		<div class="login-top">
				<div class="form-info">
					<form>
						<span id="myspan"></span>
						<input type="text" class="text" placeholder="用户名" required="" id="username" name="userName">
						<span id="name"></span>
						<input type="password"  placeholder="密码" required="" id="userpass" name="userPass">
						<span id="pass"></span>
						<br><br>
						<input type="text" placeholder="验证码" id="webyzm" ><span id="ver"></span>
						<br>
						<img src="/myhouse/mediator/captcha" id="yzm">
						<br><br><br>
						 <label class="hvr-sweep-to-right">
				         	<input type="button" value="登录" id="dl">
				         </label>
					</form>
				</div>
			<div class="create">
				<h4>是否加入 My House?</h4>
				<a class="hvr-sweep-to-right" href="/myhouse/web/register">创建账户</a>
				<div class="clearfix"> </div>
			</div>
	</div>
</div>
</div>
<script>
	$(function (){
		$("#yzm").click(function (){
			$("#yzm").attr("src","/myhouse/mediator/captcha?x="+Math.random())
		})
	});
</script>
<script>//验证验证码
	$(function (){
		$("#webyzm").blur(check)
	})
function check(){
	var inputCode = $("#webyzm").val();
	$.ajax({
		url: "/myhouse/mediator/check",
		type:"get",
		async: false,
		data: {inputCode:inputCode},
		success:function (mes){
			if (mes == "1"){
				$("#ver").text("√");
				$("#ver").css("color","green");
				flag = true;
			}else if (mes == "0"){
				$("#ver").text("×");
				$("#ver").css("color","red");
				flag = false;
			}
		}
	})
}
</script>
<script>
	$(function (){
		$("#dl").click(yanzheng);
	});
	//用ajax验证用户名和密码是否正确
	var flag;
	function yanzheng(){

		var userName = $("#username").val();
		var userPass = $("#userpass").val();
		$.ajax({
			url:"/myhouse/web/userLogin",
			type:"post",
			async:false,
			data:{userName:userName,userPass:userPass},
			success:function (mes){
				if (mes == "1"){
					if (flag){
						location.href = "/myhouse/web/index";
					}
				}else if(mes == "0"){
					$("#myspan").html("用户名或密码错误")
					$("#myspan").css("color","red")
				}
			}
		});
	}
</script>
<!--//contact-->
<!--footer-->
<jsp:include page="/inc/footer.jsp"></jsp:include>
<!--//footer-->
</body>
</html>